<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>iconfont Demo</title>
  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
  <style>
    .main .logo {
      margin-top: 0;
      height: auto;
    }

    .main .logo a {
      display: flex;
      align-items: center;
    }

    .main .logo .sub-title {
      margin-left: 0.5em;
      font-size: 22px;
      color: #fff;
      background: linear-gradient(-45deg, #3967FF, #B500FE);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
  </style>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
      
    </a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1523720" target="_blank" class="nav-more">查看项目</a>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon iconfont">&#xe67f;</span>
                <div class="name">实时预览 选中</div>
                <div class="code-name">&amp;#xe67f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe705;</span>
                <div class="name">登记</div>
                <div class="code-name">&amp;#xe705;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe651;</span>
                <div class="name">资产</div>
                <div class="code-name">&amp;#xe651;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe616;</span>
                <div class="name">资产</div>
                <div class="code-name">&amp;#xe616;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe654;</span>
                <div class="name">资源</div>
                <div class="code-name">&amp;#xe654;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe897;</span>
                <div class="name">资源 99</div>
                <div class="code-name">&amp;#xe897;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe610;</span>
                <div class="name">资源 3</div>
                <div class="code-name">&amp;#xe610;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe757;</span>
                <div class="name">无数据</div>
                <div class="code-name">&amp;#xe757;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe665;</span>
                <div class="name">申请</div>
                <div class="code-name">&amp;#xe665;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe805;</span>
                <div class="name">人员</div>
                <div class="code-name">&amp;#xe805;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f2;</span>
                <div class="name">关闭弹框</div>
                <div class="code-name">&amp;#xe6f2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe608;</span>
                <div class="name">更多_1</div>
                <div class="code-name">&amp;#xe608;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8c6;</span>
                <div class="name">收藏</div>
                <div class="code-name">&amp;#xe8c6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe686;</span>
                <div class="name">收藏</div>
                <div class="code-name">&amp;#xe686;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe727;</span>
                <div class="name">属性</div>
                <div class="code-name">&amp;#xe727;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe695;</span>
                <div class="name">接口变更动态</div>
                <div class="code-name">&amp;#xe695;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe632;</span>
                <div class="name">预览报表模板</div>
                <div class="code-name">&amp;#xe632;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe648;</span>
                <div class="name">待评价</div>
                <div class="code-name">&amp;#xe648;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe607;</span>
                <div class="name">向上</div>
                <div class="code-name">&amp;#xe607;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe625;</span>
                <div class="name">导航_收藏_已收藏</div>
                <div class="code-name">&amp;#xe625;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe605;</span>
                <div class="name">收藏</div>
                <div class="code-name">&amp;#xe605;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60c;</span>
                <div class="name">申请管理</div>
                <div class="code-name">&amp;#xe60c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60e;</span>
                <div class="name">使用申请</div>
                <div class="code-name">&amp;#xe60e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe662;</span>
                <div class="name">浏览2</div>
                <div class="code-name">&amp;#xe662;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73f;</span>
                <div class="name">目录项</div>
                <div class="code-name">&amp;#xe73f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe740;</span>
                <div class="name">有效目录项</div>
                <div class="code-name">&amp;#xe740;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe698;</span>
                <div class="name">施工单位_sel</div>
                <div class="code-name">&amp;#xe698;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe631;</span>
                <div class="name">消防站总量背景</div>
                <div class="code-name">&amp;#xe631;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe647;</span>
                <div class="name">切换账号</div>
                <div class="code-name">&amp;#xe647;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73e;</span>
                <div class="name">应用系统</div>
                <div class="code-name">&amp;#xe73e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe67e;</span>
                <div class="name">资源 42</div>
                <div class="code-name">&amp;#xe67e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe635;</span>
                <div class="name">数据汇总</div>
                <div class="code-name">&amp;#xe635;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe735;</span>
                <div class="name">财务月报</div>
                <div class="code-name">&amp;#xe735;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe736;</span>
                <div class="name">数据开发平台</div>
                <div class="code-name">&amp;#xe736;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe737;</span>
                <div class="name">低代码平台</div>
                <div class="code-name">&amp;#xe737;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe738;</span>
                <div class="name">平台管理</div>
                <div class="code-name">&amp;#xe738;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73a;</span>
                <div class="name">主数据平台</div>
                <div class="code-name">&amp;#xe73a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73b;</span>
                <div class="name">物联网平台</div>
                <div class="code-name">&amp;#xe73b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73c;</span>
                <div class="name">数据治理平台</div>
                <div class="code-name">&amp;#xe73c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73d;</span>
                <div class="name">数据分析平台</div>
                <div class="code-name">&amp;#xe73d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62f;</span>
                <div class="name">验证码</div>
                <div class="code-name">&amp;#xe62f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe813;</span>
                <div class="name">新增</div>
                <div class="code-name">&amp;#xe813;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe611;</span>
                <div class="name">用户名</div>
                <div class="code-name">&amp;#xe611;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62d;</span>
                <div class="name">选择</div>
                <div class="code-name">&amp;#xe62d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b7;</span>
                <div class="name">通过</div>
                <div class="code-name">&amp;#xe6b7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62a;</span>
                <div class="name">切换</div>
                <div class="code-name">&amp;#xe62a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe603;</span>
                <div class="name">删除</div>
                <div class="code-name">&amp;#xe603;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64a;</span>
                <div class="name">bg-add</div>
                <div class="code-name">&amp;#xe64a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe626;</span>
                <div class="name">修改</div>
                <div class="code-name">&amp;#xe626;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe650;</span>
                <div class="name">箭头</div>
                <div class="code-name">&amp;#xe650;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61a;</span>
                <div class="name">进度查询</div>
                <div class="code-name">&amp;#xe61a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec56;</span>
                <div class="name">流计算</div>
                <div class="code-name">&amp;#xec56;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec5c;</span>
                <div class="name">数据挖掘</div>
                <div class="code-name">&amp;#xec5c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6de;</span>
                <div class="name">检核例外管理</div>
                <div class="code-name">&amp;#xe6de;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6df;</span>
                <div class="name">关联度分析</div>
                <div class="code-name">&amp;#xe6df;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e0;</span>
                <div class="name">属性填充率检核</div>
                <div class="code-name">&amp;#xe6e0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e1;</span>
                <div class="name">变更查询</div>
                <div class="code-name">&amp;#xe6e1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e2;</span>
                <div class="name">属性值差异分析</div>
                <div class="code-name">&amp;#xe6e2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e3;</span>
                <div class="name">我的分析</div>
                <div class="code-name">&amp;#xe6e3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e4;</span>
                <div class="name">变更订阅</div>
                <div class="code-name">&amp;#xe6e4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e5;</span>
                <div class="name">检核任务</div>
                <div class="code-name">&amp;#xe6e5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e6;</span>
                <div class="name">全链分析</div>
                <div class="code-name">&amp;#xe6e6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e7;</span>
                <div class="name">影响分析</div>
                <div class="code-name">&amp;#xe6e7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e8;</span>
                <div class="name">一致性检核</div>
                <div class="code-name">&amp;#xe6e8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e9;</span>
                <div class="name">血缘分析</div>
                <div class="code-name">&amp;#xe6e9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ea;</span>
                <div class="name">组合关系缺失检核</div>
                <div class="code-name">&amp;#xe6ea;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6eb;</span>
                <div class="name">元数据标准覆盖率检核</div>
                <div class="code-name">&amp;#xe6eb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ec;</span>
                <div class="name">重复元数据分析</div>
                <div class="code-name">&amp;#xe6ec;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ed;</span>
                <div class="name">元数据对比分析</div>
                <div class="code-name">&amp;#xe6ed;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe649;</span>
                <div class="name">80已审核</div>
                <div class="code-name">&amp;#xe649;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63f;</span>
                <div class="name">待审核订单</div>
                <div class="code-name">&amp;#xe63f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe689;</span>
                <div class="name">新增</div>
                <div class="code-name">&amp;#xe689;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe739;</span>
                <div class="name">退回</div>
                <div class="code-name">&amp;#xe739;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c0;</span>
                <div class="name">党建_主题课件</div>
                <div class="code-name">&amp;#xe7c0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe669;</span>
                <div class="name">多维度</div>
                <div class="code-name">&amp;#xe669;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe675;</span>
                <div class="name">时间</div>
                <div class="code-name">&amp;#xe675;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe619;</span>
                <div class="name">运行</div>
                <div class="code-name">&amp;#xe619;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeafe;</span>
                <div class="name">搜索</div>
                <div class="code-name">&amp;#xeafe;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeb0a;</span>
                <div class="name">箭头_向下</div>
                <div class="code-name">&amp;#xeb0a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe639;</span>
                <div class="name">调音</div>
                <div class="code-name">&amp;#xe639;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe606;</span>
                <div class="name">异常</div>
                <div class="code-name">&amp;#xe606;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe646;</span>
                <div class="name">数据</div>
                <div class="code-name">&amp;#xe646;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62b;</span>
                <div class="name">3-数据5</div>
                <div class="code-name">&amp;#xe62b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe725;</span>
                <div class="name">尽调任务</div>
                <div class="code-name">&amp;#xe725;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe618;</span>
                <div class="name">正在运行列表</div>
                <div class="code-name">&amp;#xe618;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62c;</span>
                <div class="name">密码</div>
                <div class="code-name">&amp;#xe62c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe620;</span>
                <div class="name">个人资料</div>
                <div class="code-name">&amp;#xe620;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe652;</span>
                <div class="name">右</div>
                <div class="code-name">&amp;#xe652;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61d;</span>
                <div class="name">数据集成</div>
                <div class="code-name">&amp;#xe61d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64e;</span>
                <div class="name">流程管理</div>
                <div class="code-name">&amp;#xe64e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe697;</span>
                <div class="name">风险预警</div>
                <div class="code-name">&amp;#xe697;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe790;</span>
                <div class="name">左左</div>
                <div class="code-name">&amp;#xe790;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe792;</span>
                <div class="name">业务报表系统</div>
                <div class="code-name">&amp;#xe792;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8b6;</span>
                <div class="name">平台管理</div>
                <div class="code-name">&amp;#xe8b6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe763;</span>
                <div class="name">登录</div>
                <div class="code-name">&amp;#xe763;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe791;</span>
                <div class="name">开发者</div>
                <div class="code-name">&amp;#xe791;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeafd;</span>
                <div class="name">左左</div>
                <div class="code-name">&amp;#xeafd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7dd;</span>
                <div class="name">标签</div>
                <div class="code-name">&amp;#xe7dd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe604;</span>
                <div class="name">文件</div>
                <div class="code-name">&amp;#xe604;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c1;</span>
                <div class="name">图片</div>
                <div class="code-name">&amp;#xe6c1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe602;</span>
                <div class="name">流程</div>
                <div class="code-name">&amp;#xe602;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe623;</span>
                <div class="name">数据表</div>
                <div class="code-name">&amp;#xe623;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe699;</span>
                <div class="name">数据库</div>
                <div class="code-name">&amp;#xe699;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60b;</span>
                <div class="name">分页</div>
                <div class="code-name">&amp;#xe60b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe694;</span>
                <div class="name">表格</div>
                <div class="code-name">&amp;#xe694;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe601;</span>
                <div class="name">多选框</div>
                <div class="code-name">&amp;#xe601;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe653;</span>
                <div class="name">单选框</div>
                <div class="code-name">&amp;#xe653;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60f;</span>
                <div class="name">颜色更换</div>
                <div class="code-name">&amp;#xe60f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b9;</span>
                <div class="name">评分</div>
                <div class="code-name">&amp;#xe6b9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63a;</span>
                <div class="name">时间选择器</div>
                <div class="code-name">&amp;#xe63a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60a;</span>
                <div class="name">时间选择器-time</div>
                <div class="code-name">&amp;#xe60a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a1;</span>
                <div class="name">向上滑块</div>
                <div class="code-name">&amp;#xe6a1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe600;</span>
                <div class="name">开关</div>
                <div class="code-name">&amp;#xe600;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xeafc;</span>
                <div class="name">文本域</div>
                <div class="code-name">&amp;#xeafc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63e;</span>
                <div class="name">计数器</div>
                <div class="code-name">&amp;#xe63e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe743;</span>
                <div class="name">符号-树选择器</div>
                <div class="code-name">&amp;#xe743;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe779;</span>
                <div class="name">文本框</div>
                <div class="code-name">&amp;#xe779;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60d;</span>
                <div class="name">消息</div>
                <div class="code-name">&amp;#xe60d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe617;</span>
                <div class="name">星星</div>
                <div class="code-name">&amp;#xe617;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61e;</span>
                <div class="name">点赞</div>
                <div class="code-name">&amp;#xe61e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64f;</span>
                <div class="name">更多 </div>
                <div class="code-name">&amp;#xe64f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe645;</span>
                <div class="name">结束</div>
                <div class="code-name">&amp;#xe645;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe644;</span>
                <div class="name">用户</div>
                <div class="code-name">&amp;#xe644;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe621;</span>
                <div class="name">密码</div>
                <div class="code-name">&amp;#xe621;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe636;</span>
                <div class="name">校验码</div>
                <div class="code-name">&amp;#xe636;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe640;</span>
                <div class="name">人</div>
                <div class="code-name">&amp;#xe640;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe641;</span>
                <div class="name">验证码</div>
                <div class="code-name">&amp;#xe641;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe642;</span>
                <div class="name">账号</div>
                <div class="code-name">&amp;#xe642;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe643;</span>
                <div class="name">密码</div>
                <div class="code-name">&amp;#xe643;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ce;</span>
                <div class="name">短信管理</div>
                <div class="code-name">&amp;#xe6ce;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64d;</span>
                <div class="name">用户</div>
                <div class="code-name">&amp;#xe64d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe629;</span>
                <div class="name">用户</div>
                <div class="code-name">&amp;#xe629;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe615;</span>
                <div class="name">设置</div>
                <div class="code-name">&amp;#xe615;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c2;</span>
                <div class="name">时间</div>
                <div class="code-name">&amp;#xe6c2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xea05;</span>
                <div class="name">管理</div>
                <div class="code-name">&amp;#xea05;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xea26;</span>
                <div class="name">管理</div>
                <div class="code-name">&amp;#xea26;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xea22;</span>
                <div class="name">项目管理</div>
                <div class="code-name">&amp;#xea22;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xea09;</span>
                <div class="name">团队协作</div>
                <div class="code-name">&amp;#xea09;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xea04;</span>
                <div class="name">首页-选中</div>
                <div class="code-name">&amp;#xea04;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xea42;</span>
                <div class="name">平台管理</div>
                <div class="code-name">&amp;#xea42;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xea44;</span>
                <div class="name">基础设置</div>
                <div class="code-name">&amp;#xea44;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'iconfont';
  src: url('iconfont.woff2?t=1682042259661') format('woff2'),
       url('iconfont.woff?t=1682042259661') format('woff'),
       url('iconfont.ttf?t=1682042259661') format('truetype');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon iconfont icon-shishiyulanxuanzhong"></span>
            <div class="name">
              实时预览 选中
            </div>
            <div class="code-name">.icon-shishiyulanxuanzhong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dengji"></span>
            <div class="name">
              登记
            </div>
            <div class="code-name">.icon-dengji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-huabanfuben"></span>
            <div class="name">
              资产
            </div>
            <div class="code-name">.icon-huabanfuben
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zichan"></span>
            <div class="name">
              资产
            </div>
            <div class="code-name">.icon-zichan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ziyuan1"></span>
            <div class="name">
              资源
            </div>
            <div class="code-name">.icon-ziyuan1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ziyuan2"></span>
            <div class="name">
              资源 99
            </div>
            <div class="code-name">.icon-ziyuan2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ziyuan3"></span>
            <div class="name">
              资源 3
            </div>
            <div class="code-name">.icon-ziyuan3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wushuju"></span>
            <div class="name">
              无数据
            </div>
            <div class="code-name">.icon-wushuju
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shenqing"></span>
            <div class="name">
              申请
            </div>
            <div class="code-name">.icon-shenqing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-renyuan"></span>
            <div class="name">
              人员
            </div>
            <div class="code-name">.icon-renyuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-guanbidankuang"></span>
            <div class="name">
              关闭弹框
            </div>
            <div class="code-name">.icon-guanbidankuang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gengduo_"></span>
            <div class="name">
              更多_1
            </div>
            <div class="code-name">.icon-gengduo_
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shoucang2"></span>
            <div class="name">
              收藏
            </div>
            <div class="code-name">.icon-shoucang2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shoucang1"></span>
            <div class="name">
              收藏
            </div>
            <div class="code-name">.icon-shoucang1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuxing"></span>
            <div class="name">
              属性
            </div>
            <div class="code-name">.icon-shuxing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiekou"></span>
            <div class="name">
              接口变更动态
            </div>
            <div class="code-name">.icon-jiekou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yulanbaobiaomoban"></span>
            <div class="name">
              预览报表模板
            </div>
            <div class="code-name">.icon-yulanbaobiaomoban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-daipingjia"></span>
            <div class="name">
              待评价
            </div>
            <div class="code-name">.icon-daipingjia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiangshang"></span>
            <div class="name">
              向上
            </div>
            <div class="code-name">.icon-xiangshang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-daohangshoucangyishoucang"></span>
            <div class="name">
              导航_收藏_已收藏
            </div>
            <div class="code-name">.icon-daohangshoucangyishoucang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shoucang"></span>
            <div class="name">
              收藏
            </div>
            <div class="code-name">.icon-shoucang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shenqingguanli"></span>
            <div class="name">
              申请管理
            </div>
            <div class="code-name">.icon-shenqingguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-office-supplies-used-to-apply-for"></span>
            <div class="name">
              使用申请
            </div>
            <div class="code-name">.icon-office-supplies-used-to-apply-for
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-liulan2"></span>
            <div class="name">
              浏览2
            </div>
            <div class="code-name">.icon-liulan2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-muluxiang"></span>
            <div class="name">
              目录项
            </div>
            <div class="code-name">.icon-muluxiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-youxiaomuluxiang"></span>
            <div class="name">
              有效目录项
            </div>
            <div class="code-name">.icon-youxiaomuluxiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shigongdanweisel"></span>
            <div class="name">
              施工单位_sel
            </div>
            <div class="code-name">.icon-shigongdanweisel
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiaofangzhanzongliangbeijing"></span>
            <div class="name">
              消防站总量背景
            </div>
            <div class="code-name">.icon-xiaofangzhanzongliangbeijing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-qiehuanzhanghao"></span>
            <div class="name">
              切换账号
            </div>
            <div class="code-name">.icon-qiehuanzhanghao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yingyongxitong"></span>
            <div class="name">
              应用系统
            </div>
            <div class="code-name">.icon-yingyongxitong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ziyuan"></span>
            <div class="name">
              资源 42
            </div>
            <div class="code-name">.icon-ziyuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shujuhuizong"></span>
            <div class="name">
              数据汇总
            </div>
            <div class="code-name">.icon-shujuhuizong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-caiwuyuebao"></span>
            <div class="name">
              财务月报
            </div>
            <div class="code-name">.icon-caiwuyuebao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shujukaifapingtai"></span>
            <div class="name">
              数据开发平台
            </div>
            <div class="code-name">.icon-shujukaifapingtai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-didaimapingtai"></span>
            <div class="name">
              低代码平台
            </div>
            <div class="code-name">.icon-didaimapingtai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-pingtaiguanli"></span>
            <div class="name">
              平台管理
            </div>
            <div class="code-name">.icon-pingtaiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhushujupingtai"></span>
            <div class="name">
              主数据平台
            </div>
            <div class="code-name">.icon-zhushujupingtai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wulianwangpingtai"></span>
            <div class="name">
              物联网平台
            </div>
            <div class="code-name">.icon-wulianwangpingtai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shujuzhilipingtai"></span>
            <div class="name">
              数据治理平台
            </div>
            <div class="code-name">.icon-shujuzhilipingtai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shujufenxipingtai"></span>
            <div class="name">
              数据分析平台
            </div>
            <div class="code-name">.icon-shujufenxipingtai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yanzhengmabeifen"></span>
            <div class="name">
              验证码
            </div>
            <div class="code-name">.icon-yanzhengmabeifen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xinzeng1"></span>
            <div class="name">
              新增
            </div>
            <div class="code-name">.icon-xinzeng1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yonghuming2"></span>
            <div class="name">
              用户名
            </div>
            <div class="code-name">.icon-yonghuming2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xuanze"></span>
            <div class="name">
              选择
            </div>
            <div class="code-name">.icon-xuanze
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tongguo"></span>
            <div class="name">
              通过
            </div>
            <div class="code-name">.icon-tongguo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-qiehuan"></span>
            <div class="name">
              切换
            </div>
            <div class="code-name">.icon-qiehuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shanchu"></span>
            <div class="name">
              删除
            </div>
            <div class="code-name">.icon-shanchu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-bg-add"></span>
            <div class="name">
              bg-add
            </div>
            <div class="code-name">.icon-bg-add
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiugai"></span>
            <div class="name">
              修改
            </div>
            <div class="code-name">.icon-xiugai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiantou"></span>
            <div class="name">
              箭头
            </div>
            <div class="code-name">.icon-jiantou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jinduchaxun"></span>
            <div class="name">
              进度查询
            </div>
            <div class="code-name">.icon-jinduchaxun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-liujisuan"></span>
            <div class="name">
              流计算
            </div>
            <div class="code-name">.icon-liujisuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shujuwajue"></span>
            <div class="name">
              数据挖掘
            </div>
            <div class="code-name">.icon-shujuwajue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jianheliwaiguanli"></span>
            <div class="name">
              检核例外管理
            </div>
            <div class="code-name">.icon-jianheliwaiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-guanliandufenxi"></span>
            <div class="name">
              关联度分析
            </div>
            <div class="code-name">.icon-guanliandufenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuxingtianchongshuaijianhe"></span>
            <div class="name">
              属性填充率检核
            </div>
            <div class="code-name">.icon-shuxingtianchongshuaijianhe
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biangengchaxun"></span>
            <div class="name">
              变更查询
            </div>
            <div class="code-name">.icon-biangengchaxun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuxingzhichayifenxi"></span>
            <div class="name">
              属性值差异分析
            </div>
            <div class="code-name">.icon-shuxingzhichayifenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wodefenxi"></span>
            <div class="name">
              我的分析
            </div>
            <div class="code-name">.icon-wodefenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biangengdingyue"></span>
            <div class="name">
              变更订阅
            </div>
            <div class="code-name">.icon-biangengdingyue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jianherenwu"></span>
            <div class="name">
              检核任务
            </div>
            <div class="code-name">.icon-jianherenwu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-quanlianfenxi"></span>
            <div class="name">
              全链分析
            </div>
            <div class="code-name">.icon-quanlianfenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yingxiangfenxi"></span>
            <div class="name">
              影响分析
            </div>
            <div class="code-name">.icon-yingxiangfenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yizhixingjianhe"></span>
            <div class="name">
              一致性检核
            </div>
            <div class="code-name">.icon-yizhixingjianhe
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xieyuanfenxi"></span>
            <div class="name">
              血缘分析
            </div>
            <div class="code-name">.icon-xieyuanfenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zuheguanxiqueshijianhe"></span>
            <div class="name">
              组合关系缺失检核
            </div>
            <div class="code-name">.icon-zuheguanxiqueshijianhe
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yuanshujubiaozhunfugaishuaijianhe"></span>
            <div class="name">
              元数据标准覆盖率检核
            </div>
            <div class="code-name">.icon-yuanshujubiaozhunfugaishuaijianhe
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhongfuyuanshujufenxi"></span>
            <div class="name">
              重复元数据分析
            </div>
            <div class="code-name">.icon-zhongfuyuanshujufenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yuanshujuduibifenxi"></span>
            <div class="name">
              元数据对比分析
            </div>
            <div class="code-name">.icon-yuanshujuduibifenxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yishenhe"></span>
            <div class="name">
              80已审核
            </div>
            <div class="code-name">.icon-yishenhe
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-daishenhedingdan"></span>
            <div class="name">
              待审核订单
            </div>
            <div class="code-name">.icon-daishenhedingdan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xinzeng"></span>
            <div class="name">
              新增
            </div>
            <div class="code-name">.icon-xinzeng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tuihui"></span>
            <div class="name">
              退回
            </div>
            <div class="code-name">.icon-tuihui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dangjian_zhutikejian"></span>
            <div class="name">
              党建_主题课件
            </div>
            <div class="code-name">.icon-dangjian_zhutikejian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-duoweidu"></span>
            <div class="name">
              多维度
            </div>
            <div class="code-name">.icon-duoweidu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shijian2"></span>
            <div class="name">
              时间
            </div>
            <div class="code-name">.icon-shijian2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yunhang"></span>
            <div class="name">
              运行
            </div>
            <div class="code-name">.icon-yunhang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sousuo"></span>
            <div class="name">
              搜索
            </div>
            <div class="code-name">.icon-sousuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiantou_xiangxia"></span>
            <div class="name">
              箭头_向下
            </div>
            <div class="code-name">.icon-jiantou_xiangxia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianchongxing-"></span>
            <div class="name">
              调音
            </div>
            <div class="code-name">.icon-tianchongxing-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yichang"></span>
            <div class="name">
              异常
            </div>
            <div class="code-name">.icon-yichang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuju"></span>
            <div class="name">
              数据
            </div>
            <div class="code-name">.icon-shuju
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon--shuju"></span>
            <div class="name">
              3-数据5
            </div>
            <div class="code-name">.icon--shuju
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jintiaorenwu"></span>
            <div class="name">
              尽调任务
            </div>
            <div class="code-name">.icon-jintiaorenwu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhengzaiyunhangliebiao"></span>
            <div class="name">
              正在运行列表
            </div>
            <div class="code-name">.icon-zhengzaiyunhangliebiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-icon2"></span>
            <div class="name">
              密码
            </div>
            <div class="code-name">.icon-icon2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-moban"></span>
            <div class="name">
              个人资料
            </div>
            <div class="code-name">.icon-moban
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-you"></span>
            <div class="name">
              右
            </div>
            <div class="code-name">.icon-you
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shujujicheng-"></span>
            <div class="name">
              数据集成
            </div>
            <div class="code-name">.icon-shujujicheng-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-liuchengguanli"></span>
            <div class="name">
              流程管理
            </div>
            <div class="code-name">.icon-liuchengguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fengxianyujing"></span>
            <div class="name">
              风险预警
            </div>
            <div class="code-name">.icon-fengxianyujing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zuozuo"></span>
            <div class="name">
              左左
            </div>
            <div class="code-name">.icon-zuozuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yewubaobiaoxitong"></span>
            <div class="name">
              业务报表系统
            </div>
            <div class="code-name">.icon-yewubaobiaoxitong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-pingtaiguanli2"></span>
            <div class="name">
              平台管理
            </div>
            <div class="code-name">.icon-pingtaiguanli2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-denglu"></span>
            <div class="name">
              登录
            </div>
            <div class="code-name">.icon-denglu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-kaifazhe"></span>
            <div class="name">
              开发者
            </div>
            <div class="code-name">.icon-kaifazhe
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zuozuo-copy"></span>
            <div class="name">
              左左
            </div>
            <div class="code-name">.icon-zuozuo-copy
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoqian"></span>
            <div class="name">
              标签
            </div>
            <div class="code-name">.icon-biaoqian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wenjian"></span>
            <div class="name">
              文件
            </div>
            <div class="code-name">.icon-wenjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tupian"></span>
            <div class="name">
              图片
            </div>
            <div class="code-name">.icon-tupian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-liucheng"></span>
            <div class="name">
              流程
            </div>
            <div class="code-name">.icon-liucheng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shujubiao"></span>
            <div class="name">
              数据表
            </div>
            <div class="code-name">.icon-shujubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shujuku"></span>
            <div class="name">
              数据库
            </div>
            <div class="code-name">.icon-shujuku
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fenye"></span>
            <div class="name">
              分页
            </div>
            <div class="code-name">.icon-fenye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-biaoge"></span>
            <div class="name">
              表格
            </div>
            <div class="code-name">.icon-biaoge
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-duoxuankuang"></span>
            <div class="name">
              多选框
            </div>
            <div class="code-name">.icon-duoxuankuang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-danxuankuang"></span>
            <div class="name">
              单选框
            </div>
            <div class="code-name">.icon-danxuankuang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yansegenghuan"></span>
            <div class="name">
              颜色更换
            </div>
            <div class="code-name">.icon-yansegenghuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-pingfen1"></span>
            <div class="name">
              评分
            </div>
            <div class="code-name">.icon-pingfen1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shijianxuanzeqi"></span>
            <div class="name">
              时间选择器
            </div>
            <div class="code-name">.icon-shijianxuanzeqi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shijian1"></span>
            <div class="name">
              时间选择器-time
            </div>
            <div class="code-name">.icon-shijian1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-12"></span>
            <div class="name">
              向上滑块
            </div>
            <div class="code-name">.icon-12
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-1"></span>
            <div class="name">
              开关
            </div>
            <div class="code-name">.icon-1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wenbenyu1"></span>
            <div class="name">
              文本域
            </div>
            <div class="code-name">.icon-wenbenyu1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jishuqi1"></span>
            <div class="name">
              计数器
            </div>
            <div class="code-name">.icon-jishuqi1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fuhao-shuxuanzeqi"></span>
            <div class="name">
              符号-树选择器
            </div>
            <div class="code-name">.icon-fuhao-shuxuanzeqi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wenbenkuang"></span>
            <div class="name">
              文本框
            </div>
            <div class="code-name">.icon-wenbenkuang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-buoumaotubiao14"></span>
            <div class="name">
              消息
            </div>
            <div class="code-name">.icon-buoumaotubiao14
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xingxing"></span>
            <div class="name">
              星星
            </div>
            <div class="code-name">.icon-xingxing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dianzan"></span>
            <div class="name">
              点赞
            </div>
            <div class="code-name">.icon-dianzan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gengduo"></span>
            <div class="name">
              更多 
            </div>
            <div class="code-name">.icon-gengduo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jieshu"></span>
            <div class="name">
              结束
            </div>
            <div class="code-name">.icon-jieshu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yonghu3"></span>
            <div class="name">
              用户
            </div>
            <div class="code-name">.icon-yonghu3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mima1"></span>
            <div class="name">
              密码
            </div>
            <div class="code-name">.icon-mima1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiaoyanma"></span>
            <div class="name">
              校验码
            </div>
            <div class="code-name">.icon-xiaoyanma
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ren"></span>
            <div class="name">
              人
            </div>
            <div class="code-name">.icon-ren
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yanzhengma"></span>
            <div class="name">
              验证码
            </div>
            <div class="code-name">.icon-yanzhengma
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhanghao"></span>
            <div class="name">
              账号
            </div>
            <div class="code-name">.icon-zhanghao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mima"></span>
            <div class="name">
              密码
            </div>
            <div class="code-name">.icon-mima
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-duanxinguanli"></span>
            <div class="name">
              短信管理
            </div>
            <div class="code-name">.icon-duanxinguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yonghu"></span>
            <div class="name">
              用户
            </div>
            <div class="code-name">.icon-yonghu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yonghu1"></span>
            <div class="name">
              用户
            </div>
            <div class="code-name">.icon-yonghu1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shezhi"></span>
            <div class="name">
              设置
            </div>
            <div class="code-name">.icon-shezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shijian"></span>
            <div class="name">
              时间
            </div>
            <div class="code-name">.icon-shijian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-menu-xitongguanli"></span>
            <div class="name">
              管理
            </div>
            <div class="code-name">.icon-menu-xitongguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-menu-daibaoguanli"></span>
            <div class="name">
              管理
            </div>
            <div class="code-name">.icon-menu-daibaoguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-menu-xiangmuguanli"></span>
            <div class="name">
              项目管理
            </div>
            <div class="code-name">.icon-menu-xiangmuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-menu-xietongbangong"></span>
            <div class="name">
              团队协作
            </div>
            <div class="code-name">.icon-menu-xietongbangong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-menu-shouye"></span>
            <div class="name">
              首页-选中
            </div>
            <div class="code-name">.icon-menu-shouye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-menu-pingtaiguanli"></span>
            <div class="name">
              平台管理
            </div>
            <div class="code-name">.icon-menu-pingtaiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-menu-jichu"></span>
            <div class="name">
              基础设置
            </div>
            <div class="code-name">.icon-menu-jichu
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shishiyulanxuanzhong"></use>
                </svg>
                <div class="name">实时预览 选中</div>
                <div class="code-name">#icon-shishiyulanxuanzhong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dengji"></use>
                </svg>
                <div class="name">登记</div>
                <div class="code-name">#icon-dengji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-huabanfuben"></use>
                </svg>
                <div class="name">资产</div>
                <div class="code-name">#icon-huabanfuben</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zichan"></use>
                </svg>
                <div class="name">资产</div>
                <div class="code-name">#icon-zichan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ziyuan1"></use>
                </svg>
                <div class="name">资源</div>
                <div class="code-name">#icon-ziyuan1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ziyuan2"></use>
                </svg>
                <div class="name">资源 99</div>
                <div class="code-name">#icon-ziyuan2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ziyuan3"></use>
                </svg>
                <div class="name">资源 3</div>
                <div class="code-name">#icon-ziyuan3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wushuju"></use>
                </svg>
                <div class="name">无数据</div>
                <div class="code-name">#icon-wushuju</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shenqing"></use>
                </svg>
                <div class="name">申请</div>
                <div class="code-name">#icon-shenqing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-renyuan"></use>
                </svg>
                <div class="name">人员</div>
                <div class="code-name">#icon-renyuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-guanbidankuang"></use>
                </svg>
                <div class="name">关闭弹框</div>
                <div class="code-name">#icon-guanbidankuang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gengduo_"></use>
                </svg>
                <div class="name">更多_1</div>
                <div class="code-name">#icon-gengduo_</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shoucang2"></use>
                </svg>
                <div class="name">收藏</div>
                <div class="code-name">#icon-shoucang2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shoucang1"></use>
                </svg>
                <div class="name">收藏</div>
                <div class="code-name">#icon-shoucang1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuxing"></use>
                </svg>
                <div class="name">属性</div>
                <div class="code-name">#icon-shuxing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiekou"></use>
                </svg>
                <div class="name">接口变更动态</div>
                <div class="code-name">#icon-jiekou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yulanbaobiaomoban"></use>
                </svg>
                <div class="name">预览报表模板</div>
                <div class="code-name">#icon-yulanbaobiaomoban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-daipingjia"></use>
                </svg>
                <div class="name">待评价</div>
                <div class="code-name">#icon-daipingjia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiangshang"></use>
                </svg>
                <div class="name">向上</div>
                <div class="code-name">#icon-xiangshang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-daohangshoucangyishoucang"></use>
                </svg>
                <div class="name">导航_收藏_已收藏</div>
                <div class="code-name">#icon-daohangshoucangyishoucang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shoucang"></use>
                </svg>
                <div class="name">收藏</div>
                <div class="code-name">#icon-shoucang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shenqingguanli"></use>
                </svg>
                <div class="name">申请管理</div>
                <div class="code-name">#icon-shenqingguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-office-supplies-used-to-apply-for"></use>
                </svg>
                <div class="name">使用申请</div>
                <div class="code-name">#icon-office-supplies-used-to-apply-for</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-liulan2"></use>
                </svg>
                <div class="name">浏览2</div>
                <div class="code-name">#icon-liulan2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-muluxiang"></use>
                </svg>
                <div class="name">目录项</div>
                <div class="code-name">#icon-muluxiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-youxiaomuluxiang"></use>
                </svg>
                <div class="name">有效目录项</div>
                <div class="code-name">#icon-youxiaomuluxiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shigongdanweisel"></use>
                </svg>
                <div class="name">施工单位_sel</div>
                <div class="code-name">#icon-shigongdanweisel</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiaofangzhanzongliangbeijing"></use>
                </svg>
                <div class="name">消防站总量背景</div>
                <div class="code-name">#icon-xiaofangzhanzongliangbeijing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-qiehuanzhanghao"></use>
                </svg>
                <div class="name">切换账号</div>
                <div class="code-name">#icon-qiehuanzhanghao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yingyongxitong"></use>
                </svg>
                <div class="name">应用系统</div>
                <div class="code-name">#icon-yingyongxitong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ziyuan"></use>
                </svg>
                <div class="name">资源 42</div>
                <div class="code-name">#icon-ziyuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shujuhuizong"></use>
                </svg>
                <div class="name">数据汇总</div>
                <div class="code-name">#icon-shujuhuizong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-caiwuyuebao"></use>
                </svg>
                <div class="name">财务月报</div>
                <div class="code-name">#icon-caiwuyuebao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shujukaifapingtai"></use>
                </svg>
                <div class="name">数据开发平台</div>
                <div class="code-name">#icon-shujukaifapingtai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-didaimapingtai"></use>
                </svg>
                <div class="name">低代码平台</div>
                <div class="code-name">#icon-didaimapingtai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pingtaiguanli"></use>
                </svg>
                <div class="name">平台管理</div>
                <div class="code-name">#icon-pingtaiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhushujupingtai"></use>
                </svg>
                <div class="name">主数据平台</div>
                <div class="code-name">#icon-zhushujupingtai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wulianwangpingtai"></use>
                </svg>
                <div class="name">物联网平台</div>
                <div class="code-name">#icon-wulianwangpingtai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shujuzhilipingtai"></use>
                </svg>
                <div class="name">数据治理平台</div>
                <div class="code-name">#icon-shujuzhilipingtai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shujufenxipingtai"></use>
                </svg>
                <div class="name">数据分析平台</div>
                <div class="code-name">#icon-shujufenxipingtai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yanzhengmabeifen"></use>
                </svg>
                <div class="name">验证码</div>
                <div class="code-name">#icon-yanzhengmabeifen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xinzeng1"></use>
                </svg>
                <div class="name">新增</div>
                <div class="code-name">#icon-xinzeng1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yonghuming2"></use>
                </svg>
                <div class="name">用户名</div>
                <div class="code-name">#icon-yonghuming2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xuanze"></use>
                </svg>
                <div class="name">选择</div>
                <div class="code-name">#icon-xuanze</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tongguo"></use>
                </svg>
                <div class="name">通过</div>
                <div class="code-name">#icon-tongguo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-qiehuan"></use>
                </svg>
                <div class="name">切换</div>
                <div class="code-name">#icon-qiehuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shanchu"></use>
                </svg>
                <div class="name">删除</div>
                <div class="code-name">#icon-shanchu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bg-add"></use>
                </svg>
                <div class="name">bg-add</div>
                <div class="code-name">#icon-bg-add</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiugai"></use>
                </svg>
                <div class="name">修改</div>
                <div class="code-name">#icon-xiugai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiantou"></use>
                </svg>
                <div class="name">箭头</div>
                <div class="code-name">#icon-jiantou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jinduchaxun"></use>
                </svg>
                <div class="name">进度查询</div>
                <div class="code-name">#icon-jinduchaxun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-liujisuan"></use>
                </svg>
                <div class="name">流计算</div>
                <div class="code-name">#icon-liujisuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shujuwajue"></use>
                </svg>
                <div class="name">数据挖掘</div>
                <div class="code-name">#icon-shujuwajue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jianheliwaiguanli"></use>
                </svg>
                <div class="name">检核例外管理</div>
                <div class="code-name">#icon-jianheliwaiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-guanliandufenxi"></use>
                </svg>
                <div class="name">关联度分析</div>
                <div class="code-name">#icon-guanliandufenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuxingtianchongshuaijianhe"></use>
                </svg>
                <div class="name">属性填充率检核</div>
                <div class="code-name">#icon-shuxingtianchongshuaijianhe</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biangengchaxun"></use>
                </svg>
                <div class="name">变更查询</div>
                <div class="code-name">#icon-biangengchaxun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuxingzhichayifenxi"></use>
                </svg>
                <div class="name">属性值差异分析</div>
                <div class="code-name">#icon-shuxingzhichayifenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wodefenxi"></use>
                </svg>
                <div class="name">我的分析</div>
                <div class="code-name">#icon-wodefenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biangengdingyue"></use>
                </svg>
                <div class="name">变更订阅</div>
                <div class="code-name">#icon-biangengdingyue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jianherenwu"></use>
                </svg>
                <div class="name">检核任务</div>
                <div class="code-name">#icon-jianherenwu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-quanlianfenxi"></use>
                </svg>
                <div class="name">全链分析</div>
                <div class="code-name">#icon-quanlianfenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yingxiangfenxi"></use>
                </svg>
                <div class="name">影响分析</div>
                <div class="code-name">#icon-yingxiangfenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yizhixingjianhe"></use>
                </svg>
                <div class="name">一致性检核</div>
                <div class="code-name">#icon-yizhixingjianhe</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xieyuanfenxi"></use>
                </svg>
                <div class="name">血缘分析</div>
                <div class="code-name">#icon-xieyuanfenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zuheguanxiqueshijianhe"></use>
                </svg>
                <div class="name">组合关系缺失检核</div>
                <div class="code-name">#icon-zuheguanxiqueshijianhe</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yuanshujubiaozhunfugaishuaijianhe"></use>
                </svg>
                <div class="name">元数据标准覆盖率检核</div>
                <div class="code-name">#icon-yuanshujubiaozhunfugaishuaijianhe</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhongfuyuanshujufenxi"></use>
                </svg>
                <div class="name">重复元数据分析</div>
                <div class="code-name">#icon-zhongfuyuanshujufenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yuanshujuduibifenxi"></use>
                </svg>
                <div class="name">元数据对比分析</div>
                <div class="code-name">#icon-yuanshujuduibifenxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yishenhe"></use>
                </svg>
                <div class="name">80已审核</div>
                <div class="code-name">#icon-yishenhe</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-daishenhedingdan"></use>
                </svg>
                <div class="name">待审核订单</div>
                <div class="code-name">#icon-daishenhedingdan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xinzeng"></use>
                </svg>
                <div class="name">新增</div>
                <div class="code-name">#icon-xinzeng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tuihui"></use>
                </svg>
                <div class="name">退回</div>
                <div class="code-name">#icon-tuihui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dangjian_zhutikejian"></use>
                </svg>
                <div class="name">党建_主题课件</div>
                <div class="code-name">#icon-dangjian_zhutikejian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-duoweidu"></use>
                </svg>
                <div class="name">多维度</div>
                <div class="code-name">#icon-duoweidu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shijian2"></use>
                </svg>
                <div class="name">时间</div>
                <div class="code-name">#icon-shijian2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yunhang"></use>
                </svg>
                <div class="name">运行</div>
                <div class="code-name">#icon-yunhang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sousuo"></use>
                </svg>
                <div class="name">搜索</div>
                <div class="code-name">#icon-sousuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiantou_xiangxia"></use>
                </svg>
                <div class="name">箭头_向下</div>
                <div class="code-name">#icon-jiantou_xiangxia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianchongxing-"></use>
                </svg>
                <div class="name">调音</div>
                <div class="code-name">#icon-tianchongxing-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yichang"></use>
                </svg>
                <div class="name">异常</div>
                <div class="code-name">#icon-yichang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuju"></use>
                </svg>
                <div class="name">数据</div>
                <div class="code-name">#icon-shuju</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon--shuju"></use>
                </svg>
                <div class="name">3-数据5</div>
                <div class="code-name">#icon--shuju</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jintiaorenwu"></use>
                </svg>
                <div class="name">尽调任务</div>
                <div class="code-name">#icon-jintiaorenwu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhengzaiyunhangliebiao"></use>
                </svg>
                <div class="name">正在运行列表</div>
                <div class="code-name">#icon-zhengzaiyunhangliebiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-icon2"></use>
                </svg>
                <div class="name">密码</div>
                <div class="code-name">#icon-icon2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-moban"></use>
                </svg>
                <div class="name">个人资料</div>
                <div class="code-name">#icon-moban</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-you"></use>
                </svg>
                <div class="name">右</div>
                <div class="code-name">#icon-you</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shujujicheng-"></use>
                </svg>
                <div class="name">数据集成</div>
                <div class="code-name">#icon-shujujicheng-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-liuchengguanli"></use>
                </svg>
                <div class="name">流程管理</div>
                <div class="code-name">#icon-liuchengguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fengxianyujing"></use>
                </svg>
                <div class="name">风险预警</div>
                <div class="code-name">#icon-fengxianyujing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zuozuo"></use>
                </svg>
                <div class="name">左左</div>
                <div class="code-name">#icon-zuozuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yewubaobiaoxitong"></use>
                </svg>
                <div class="name">业务报表系统</div>
                <div class="code-name">#icon-yewubaobiaoxitong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pingtaiguanli2"></use>
                </svg>
                <div class="name">平台管理</div>
                <div class="code-name">#icon-pingtaiguanli2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-denglu"></use>
                </svg>
                <div class="name">登录</div>
                <div class="code-name">#icon-denglu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-kaifazhe"></use>
                </svg>
                <div class="name">开发者</div>
                <div class="code-name">#icon-kaifazhe</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zuozuo-copy"></use>
                </svg>
                <div class="name">左左</div>
                <div class="code-name">#icon-zuozuo-copy</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoqian"></use>
                </svg>
                <div class="name">标签</div>
                <div class="code-name">#icon-biaoqian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wenjian"></use>
                </svg>
                <div class="name">文件</div>
                <div class="code-name">#icon-wenjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tupian"></use>
                </svg>
                <div class="name">图片</div>
                <div class="code-name">#icon-tupian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-liucheng"></use>
                </svg>
                <div class="name">流程</div>
                <div class="code-name">#icon-liucheng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shujubiao"></use>
                </svg>
                <div class="name">数据表</div>
                <div class="code-name">#icon-shujubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shujuku"></use>
                </svg>
                <div class="name">数据库</div>
                <div class="code-name">#icon-shujuku</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fenye"></use>
                </svg>
                <div class="name">分页</div>
                <div class="code-name">#icon-fenye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-biaoge"></use>
                </svg>
                <div class="name">表格</div>
                <div class="code-name">#icon-biaoge</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-duoxuankuang"></use>
                </svg>
                <div class="name">多选框</div>
                <div class="code-name">#icon-duoxuankuang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-danxuankuang"></use>
                </svg>
                <div class="name">单选框</div>
                <div class="code-name">#icon-danxuankuang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yansegenghuan"></use>
                </svg>
                <div class="name">颜色更换</div>
                <div class="code-name">#icon-yansegenghuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pingfen1"></use>
                </svg>
                <div class="name">评分</div>
                <div class="code-name">#icon-pingfen1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shijianxuanzeqi"></use>
                </svg>
                <div class="name">时间选择器</div>
                <div class="code-name">#icon-shijianxuanzeqi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shijian1"></use>
                </svg>
                <div class="name">时间选择器-time</div>
                <div class="code-name">#icon-shijian1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-12"></use>
                </svg>
                <div class="name">向上滑块</div>
                <div class="code-name">#icon-12</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-1"></use>
                </svg>
                <div class="name">开关</div>
                <div class="code-name">#icon-1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wenbenyu1"></use>
                </svg>
                <div class="name">文本域</div>
                <div class="code-name">#icon-wenbenyu1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jishuqi1"></use>
                </svg>
                <div class="name">计数器</div>
                <div class="code-name">#icon-jishuqi1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fuhao-shuxuanzeqi"></use>
                </svg>
                <div class="name">符号-树选择器</div>
                <div class="code-name">#icon-fuhao-shuxuanzeqi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wenbenkuang"></use>
                </svg>
                <div class="name">文本框</div>
                <div class="code-name">#icon-wenbenkuang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-buoumaotubiao14"></use>
                </svg>
                <div class="name">消息</div>
                <div class="code-name">#icon-buoumaotubiao14</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xingxing"></use>
                </svg>
                <div class="name">星星</div>
                <div class="code-name">#icon-xingxing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dianzan"></use>
                </svg>
                <div class="name">点赞</div>
                <div class="code-name">#icon-dianzan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gengduo"></use>
                </svg>
                <div class="name">更多 </div>
                <div class="code-name">#icon-gengduo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jieshu"></use>
                </svg>
                <div class="name">结束</div>
                <div class="code-name">#icon-jieshu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yonghu3"></use>
                </svg>
                <div class="name">用户</div>
                <div class="code-name">#icon-yonghu3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mima1"></use>
                </svg>
                <div class="name">密码</div>
                <div class="code-name">#icon-mima1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiaoyanma"></use>
                </svg>
                <div class="name">校验码</div>
                <div class="code-name">#icon-xiaoyanma</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ren"></use>
                </svg>
                <div class="name">人</div>
                <div class="code-name">#icon-ren</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yanzhengma"></use>
                </svg>
                <div class="name">验证码</div>
                <div class="code-name">#icon-yanzhengma</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhanghao"></use>
                </svg>
                <div class="name">账号</div>
                <div class="code-name">#icon-zhanghao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mima"></use>
                </svg>
                <div class="name">密码</div>
                <div class="code-name">#icon-mima</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-duanxinguanli"></use>
                </svg>
                <div class="name">短信管理</div>
                <div class="code-name">#icon-duanxinguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yonghu"></use>
                </svg>
                <div class="name">用户</div>
                <div class="code-name">#icon-yonghu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yonghu1"></use>
                </svg>
                <div class="name">用户</div>
                <div class="code-name">#icon-yonghu1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shezhi"></use>
                </svg>
                <div class="name">设置</div>
                <div class="code-name">#icon-shezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shijian"></use>
                </svg>
                <div class="name">时间</div>
                <div class="code-name">#icon-shijian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-menu-xitongguanli"></use>
                </svg>
                <div class="name">管理</div>
                <div class="code-name">#icon-menu-xitongguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-menu-daibaoguanli"></use>
                </svg>
                <div class="name">管理</div>
                <div class="code-name">#icon-menu-daibaoguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-menu-xiangmuguanli"></use>
                </svg>
                <div class="name">项目管理</div>
                <div class="code-name">#icon-menu-xiangmuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-menu-xietongbangong"></use>
                </svg>
                <div class="name">团队协作</div>
                <div class="code-name">#icon-menu-xietongbangong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-menu-shouye"></use>
                </svg>
                <div class="name">首页-选中</div>
                <div class="code-name">#icon-menu-shouye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-menu-pingtaiguanli"></use>
                </svg>
                <div class="name">平台管理</div>
                <div class="code-name">#icon-menu-pingtaiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-menu-jichu"></use>
                </svg>
                <div class="name">基础设置</div>
                <div class="code-name">#icon-menu-jichu</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
